<ion-view view-title="全部商品" show-tabs>
  <ion-nav-buttons side="right">
  	<button class="button margin-right" ng-click="toggleDelete()" ng-class="{'button-icon ion-ios-trash-outline':!showDelete,'button-clear':showDelete}"><span ng-if="showDelete">完成</span></button>
  	<a class="button button-icon ion-android-add" href="#/add-product"></a>
  </ion-nav-buttons>

  <div class="row bar bar-subheader bar-dark inter-head">
		<div class="col col-fixed text-center">
			<span class="col-item icon-label" ng-click="toggleCat()" ng-class="{'ion-navicon':!showCat,'ion-ios-close-outline':showCat}">分类</span>
		</div>
		<div class="col text-right" text-filter>
			<span class="col-item" ng-click="toggleFilter()">筛选<i class="ion-funnel padding-left"></i></span>
		</div>
	</div>

	<ion-scroll class="sidebar has-subheader has-footer-large" ng-if="showCat">
    <ion-list>
      <ion-item ng-click="setFilter('')" class="">全部</ion-item>
      <ion-item ng-repeat="(label,brand) in brandList" ng-click="setFilter(label)">
      	{{label}}
      	<span class="badge badge-light">{{brand}}</span>
      </ion-item>
    </ion-list>
	</ion-scroll>

	<ion-content class="has-subheader">
		<ion-list show-delete="showDelete">
			<ion-item ng-repeat="item in products | filter:filter" class="item-thumbnail-left" href="#product-{{item._id}}">
				<ion-delete-button class="icon ion-minus-circled" ng-click="delete(item._id)"></ion-delete-button>
				<img ng-src="{{item.thumb}}"/>
				<h2>{{item.properties.brand.value + item.properties.model.value}}</h2>
				<div class="prop-list">
					<p ng-repeat="property in item.properties" class="prop-item" ng-if="property.name!='品牌' && property.name!='型号'">
						<span class="prop-label">{{property.name}}:</span>
						<span class="prop-value">{{property.value}}</span>
					</p>
				</div>
			</ion-item>
		</ion-list>
	</ion-content>
</ion-view>
